import React, { useEffect,useState } from 'react'
import axios from 'axios'

export default function AddFood(){
    const [foodCate,setFoodCate] = useState([])
    const [img,setImg] = useState('')
    const [name,setName] = useState('')
    const [price,setPrice] = useState('')
    const [f,setF] = useState('')

    const getFoodCate = async() => {
        let {data:{code,foodcate}} = await axios.get('/foodcate')
        if(code == 200){
            setFoodCate(foodcate)
        }
    }

    const addFood = async() =>{
        let obj = {img:img,name:name,price:price,foodcate:f,num:0}
        let {data:{code}}=await axios.post('/addFood',obj)
        if(code === 200){
            alert("1")
            setName("")
            setImg("")
            setPrice("")
        }
    }

    useEffect(()=>{
        getFoodCate()
    },[])

    return(
        <div>
            <select onClick={(i)=>{setF(i.target.value)
                console.log(i.target.value);
            }}>
                {
                    foodCate.map((item)=>{
                        return <option key={item._id} value={item._id}>{item.name}</option>
                    })
                }
            </select><br></br>
            <input value={img} 
            onChange={(i)=>setImg(i.target.value)}
            placeholder='请输入图片路径'></input><br></br>
            <input value={name} 
            onChange={(i)=>setName(i.target.value)}
            placeholder='请输入名称'></input><br></br>
            <input value={price} 
            onChange={(i)=>setPrice(i.target.value)}
            placeholder='请输入价钱'></input><br></br>
            <button onClick={()=>addFood()}>添加</button>
        </div>
    )
}